<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>角色信息管理</title>
</head>
<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">


<link rel="stylesheet" href="../../../css/bootstrap-table.min.css">

<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>

<!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>

<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>


<script src="../../../js/bootstrap-table.min.js"></script>

<script src="../../../js/bootstrap-table-zh-CN.min.js"></script>
<body>

<div class="modal fade" id="rolegrentmenumodal">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">

            <!-- 模态框头部 -->
            <div class="modal-header">
                <h4 class="modal-title">角色授予收回角色菜单 <span class="text-primary" id="zz"></span></h4>
                <button class="btn btn-warning" style="margin-left: 20%;" id="grantwithdrawuserroleid">授予收回角色菜单
                </button>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>

            <!-- 模态框主体 -->
            <div class="modal-body" id="usergentrolemainmodal">
                <!--                    授权编号-->
                <input type="hidden" id="tarid">
                <div class="form-inline" style="display: flex;justify-content: center">
                    <label for="ss_menuname">请输入菜单名称：</label>
                    <input type="text" class="form-control" id="ss_menuname">
                    <button class="btn btn-primary" id="ss1_btn">搜索</button>
                </div>
                <table id="grentroleandmenus_tab" class="table table-bordered table-hover">

                </table>
            </div>
        </div>
    </div>
</div>


<div class="modal fade" id="addrolemodal">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">

            <!-- 模态框头部 -->
            <div class="modal-header">
                <h4 class="modal-title">注册角色：新增角色</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>

            <!-- 模态框主体 -->
            <div class="modal-body">
                <div>
                    <div class="form-inline" style="width: 100%">
                        <label style="width: 15%">
                            角色名称：
                        </label>
                        <input placeholder="角色名称" style="width: 60%" type="text" class="form-control" id="zc_rolename">
                    </div>
                    <div class="form-inline" style="width: 100%;margin-top: 2%">
                        <label style="width: 15%">
                            角色说明：
                        </label>
                        <input placeholder="角色说明" style="width: 60%" type="text" class="form-control" id="zc_descn">
                    </div>
                    <button class="btn btn-primary" id="baocun_role">保存</button>
                </div>
            </div>
        </div>
    </div>
</div>

<div style="margin-bottom: 20px;">
    <div class="form-inline" style="display: flex;justify-content: center">
        <label for="ss_rolename">请输入角色名称：</label>
        <input type="text" class="form-control" id="ss_rolename">
        <button class="btn btn-primary" id="ss_btn">搜索</button>
<!--        当前登录用户必须拥有新增的角色-->
        <button class="btn btn-primary" id="zcjuesebtn" style="margin-left: 100px;">注册角色</button>
        <button class="btn btn-info" style="margin-left: 100px;" id="rolegrentmenubtn">角色授予或收回菜单</button>
    </div>
</div>

<div>
    <table id="role_table">

    </table>
</div>

<script>
    $(function () {
        $("#role_table").bootstrapTable({
            method: "post",
            contentType: "application/x-www-form-urlencoded;charset=utf-8",
            url: "/sys/queryallrolesys",
            striped: true,
            pageNumber: 1,
            pagination: true,
            sidePagination: "server",
            pageSize: 5,
            pageList: [5,8,10],
            queryParams: function (parms) {
                return {
                    pageNumber: (parms.offset / parms.limit) + 1,
                    pageSize: parms.limit,
                    rolesname:$("#ss_rolename").val()
                }
            },
            columns: [

                {
                    title: "选择", field: "check", align: "center",
                    formatter: function (value, row, index) {
                        var input1 = "<input class='form-control' value='" + row.id + "' type='checkbox'>"
                        return input1;
                    }
                },
                {title: "序号", field: "id", align: "center"},
                {title: "角色名称", field: "name", align: "center"},
                {title: "角色说明", field: "descn", align: "center"},
            ],
        })

        $("#ss_btn").click(function () {
            $("#role_table").bootstrapTable("refresh");
        })
        //角色授予或者收回菜单
        $("#rolegrentmenubtn").click(function () {
            $('#grentroleandmenus_tab').bootstrapTable('destroy');
            var a=0
            $("#role_table input:checked").each(function () {
                a=$(this).val()
                $("#zz").text($(this).parent().next().next().text())
            })
            if(a!=0){
                $("#rolegrentmenumodal").modal("show")
                $.ajax({
                    type:"post",
                    data:"id="+a,
                    url:"/sys/targtentid",
                    success:function (zdata) {
                        $("#tarid").val(zdata.tarroleid)
                        $("#grentroleandmenus_tab").bootstrapTable({
                            method: "post",
                            contentType: "application/x-www-form-urlencoded;charset=utf-8",
                            url: "/sys/querygrentrolemenus",
                            striped: true,
                            pageNumber: 1,
                            pagination: true,
                            sidePagination: "server",
                            pageSize: 10,
                            pageList: [5, 8, 10, 15],
                            queryParams: function (parms) {
                                return {
                                    pageNumber: (parms.offset / parms.limit) + 1,
                                    pageSize: parms.limit,
                                    menunames:$("#ss_menuname").val(),
                                }
                            },
                            columns: [
                                {
                                    title: "选择", field: "check", align: "center",
                                    formatter: function (value, row, index) {
                                        var input1 = "<input class='form-control cbox' checked  value='" + row.id + "' type='checkbox'>"
                                        var input2 = "<input class='form-control cbox'   value='" + row.id + "' type='checkbox'>"
                                        if(zdata.x.indexOf(row.id+",")>-1){
                                            return input1
                                        }else{
                                        return input2;
                                        }
                                    }
                                },
                                {title: "序号", field: "id", align: "center"},
                                {title: "菜单名称", field: "name", align: "center"},
                                {title: "菜单说明", field: "tip", align: "center"},
                            ],
                        })


                    }
                })

                //查询选中的编号拥有的菜单编号

            }else{
                alert("请选择要授予或收回的角色")
            }
        })
        $("#ss1_btn").click(function () {
            $("#grentroleandmenus_tab").bootstrapTable("refresh");
        })
        //点击授权或收回角色菜单
        $("#grantwithdrawuserroleid").click(function () {
            var x=[];
                $(".cbox").each(function () {
                    x.unshift($(this).val())
                })
            var z=[]
            var az=0
            $(".cbox:checked").each(function () {
                az+=$(this).val()
                z.push($(this).val())
            })
            if(az==0){
                $.ajax({
                    type: "POST",
                    data: JSON.stringify({
                        deleteid: x,
                        insertid: z,
                        tarroleid: $("#tarid").val()
                    }),
                    contentType: 'application/json',
                    url: "/sys/grentshouhuirolemenus2",
                    success: function (zzz) {
                        $("#rolegrentmenumodal").modal("hide");
                      alert("授权或者收回成功")
                    }
                })
            }else{
                $.ajax({
                    type:"POST",
                    data:JSON.stringify({
                        deleteid:x,
                        insertid:z,
                        tarroleid:$("#tarid").val()
                    }),
                    contentType: 'application/json',
                    url:"/sys/grentshouhuirolemenus1",
                    success:function (xxx) {
                        $("#rolegrentmenumodal").modal("hide");
                        alert("授权或者收回成功")

                    }
                })
            }

        })
        //注册角色模态框显示
        $("#zcjuesebtn").click(function () {
            $("#zc_rolename").val("");
            $("#zc_descn").val("");
            $("#addrolemodal").modal("show");
        })
        //注册角色
        $("#baocun_role").click(function () {
            $.ajax({
                type:"post",
                url:"/sys/inserttroleadddzc",
                data:"name="+$("#zc_rolename").val()+"&descn="+$("#zc_descn").val(),
                success:function (z) {
                    alert("注册角色成功")
                    $("#addrolemodal").modal("hide");
                }
            })
        })
    })


</script>
</body>
</html>